<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
<!--    <script src="../static/js/jquery-3.7.1.min.js"></script>-->
    <link rel="stylesheet" type="text/css" href="../static/easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../static/easyui/themes/icon.css">
    <script type="text/javascript" src="../static/easyui/jquery.min.js"></script>
    <script type="text/javascript" src="../static/easyui/jquery.easyui.min.js"></script>
</head>

<body>
<table id="mytable" class="easyui-datagrid" style="width:400px;height:250px" data-options="fitColumns:true,singleSelect:true">
    <thead>
    <tr>
        <th data-options="field:'code',width:100">编码</th>
        <th data-options="field:'name',width:100">名称</th>
        <th data-options="field:'price',width:100,align:'right'">价格</th>
        <th >操作</th>
    </tr>
    </thead>
</table>
</body>
<script>
    var data = [
        {code:'10012',name:'黄小姐',price: 20},
        {code:'10013',name:'黄小姐',price: 20},
        {code:'10014',name:'黄小姐',price: 20}
    ]
    $(function (){
        $('#mytable').datagrid('loadData',data)
    })

</script>
</html>